import React from "react";
import { Show, Content } from "./style";
import { getDetail } from "../../api";

export default class NewList extends React.PureComponent {
  state = {
    showDetail: ""
  };
  componentDidMount() {
    if (!this.props.match.params.id) {
      return false;
    }
    getDetail({ aid: this.props.match.params.id }).then(res => {
      this.setState({
        showDetail: res.data.data
      });
    });
  }
  render() {
    return (
      <div>
        <Show>
          <Content>
            {this.state.showDetail && (
              <div>
                <h2>{this.state.showDetail.title}</h2>
                <div className="time">
                  {this.state.showDetail.created_at}
                  <span>
                    <i className="iconfont">&#xe606;</i>
                    {this.state.showDetail.views}
                  </span>
                </div>
                <div
                  className="content"
                  dangerouslySetInnerHTML={{
                    __html: this.state.showDetail.content
                  }}
                />
              </div>
            )}
          </Content>
        </Show>
      </div>
    );
  }
}
